<template>
    <div>
      <div style="margin: 30px;font-size: 50px;">
        <p>切换背景</p>
      </div>
      <div style="margin: 30px;">
        <el-button type="" @click="changeTheme('bg-green')">浅绿色</el-button>
        <el-button type="" @click="changeTheme('bg-light-blue')">浅蓝色</el-button>
        <el-button type="" @click="changeTheme('bg-sky-blue')">天蓝色</el-button>
        <el-button type="" @click="changeTheme('bg-orange')">橘黄色</el-button>
        <el-button type="" @click="changeTheme('bg-white')">白色</el-button>
      </div>
    </div>
</template>

<script>
  export default {
    name: "index",
    methods: {
        changeTheme(background){
            window.localStorage.setItem("background", background);
            location.reload();
        }
    }
  }
</script>
